<template>
    <view>
        <uni-forms-item
            :name="name"
            :label="label"
        >
            <uni-file-picker
            	v-model="imageValue1"
            	file-mediatype="image" 
            	file-extname="png,jpg"
            	limit="1"
            	return-type="object"
            	mode="grid" 
            	@select="select" 
            	@delete="delete1" 
            />
        </uni-forms-item>
    </view>
</template>

<script lang="ts" setup>
    import { onLoad, onShow, onHide, onReady, onUnload } from '@dcloudio/uni-app'
    import { markRaw, onBeforeUnmount, reactive, ref, watchEffect } from 'vue'
    import type { Ref, Raw } from 'vue'
    import uploadApi from '@/apis/uploadApi'
    import { fileUploadBase64ExApi } from '@/apis'
    
    const imageValue1: Ref<any> = ref({
    // name: '',
    // extname: '',
    // url: '',
    // path: '',
    })
    
    const props = withDefaults(defineProps<{
        name?: string,
        label?: string,
        modelValue?: string,
    }>(), {
        name: '',
        label: '',
        modelValue: '',
    })
    const emits = defineEmits<{
        (e:'update:modelValue', data: any): void
    }>()
    
    watchEffect(() => {
        if (props.modelValue) {
            imageValue1.value = {
                // name: '',
                // extname: '',
                path: props.modelValue,
                url: 'http://60.191.72.66:10089' + props.modelValue,
            }
        }
    })
    
    
    const fileToBase64 = async(filePath) => {
        const fs = uni.getFileSystemManager();
        try {
            // 读取文件为二进制数据
            const buffer = fs.readFileSync(filePath);
            // 将二进制数据转换为Base64字符串
            const base64 = wx.arrayBufferToBase64(buffer);
            return base64;
        } catch (e) {
            console.error('文件读取或转换错误:', e);
            throw e;
        }
    }
    
    
    const select = async(e) => {
        console.log('选择文件：',e)
        console.log(imageValue1.value)
        // console.log(e.tempFiles[0].file)
        try {
            const base64Data = await fileToBase64(e.tempFilePaths[0]);
            // console.log('Base64编码:', base64Data);
            // 这里可以使用base64Data进行下一步操作，如设置图片src等
            fileUploadBase64ExApi({
                data: 'data:image/png;base64,' + base64Data
            }).then((res: any) => {
                emits('update:modelValue', res[0].url)
                // if (res.code == 200) {
                //     emits('update:modelValue', res.data.path)
                // } else {
                //     uni.showToast({
                //          title: res.msg,
                //          icon: 'error',
                //          mask: true,
                //     });
                //     imageValue1.value = {}
                //     emits('update:modelValue', '')
                // }
            }).catch(err => {
                console.log('拉闸')
                imageValue1.value = {}
                emits('update:modelValue', '')
            })
        } catch (error) {
            console.error('处理过程中出错:', error);
        }
        
    }
    const delete1 = (e) => {
        console.log('删除：',e)
        console.log(imageValue1.value)
        imageValue1.value = {}
        emits('update:modelValue', '')
    }
    
</script>

<style>

</style>